<script setup lang='ts'>
import { ref, reactive } from 'vue'
import { useComponents } from '../../stores/counter'
import { storeToRefs } from 'pinia';
import { ElMessage } from 'element-plus'
//storeToRefs  响应式共享状态
const { canvasComponents } = storeToRefs(useComponents())
console.log(canvasComponents, "打印的是啥？");
const PreserveClick = () => {//获取getItem保存setItem
    let re = localStorage.setItem("setcanvasComponents", JSON.stringify(canvasComponents.value))
    console.log(re, "22222222222");
    //刷新不丢失
    ElMessage({
        showClose: true,
        message: '持久化保存成功。。。',
        type: 'success',
    })

}

</script>

<template>
    <div class="csn" @click="PreserveClick">保存</div>
</template>

<style lang='scss' scoped>
.csn {
    font-size: 16px;
}
</style>